<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>首页</title>

<style type="text/css">
	*{
		padding: 0;
		margin: 0;
		font-family: "你管我体";
	}
	.header{
		height: 72px;
		background: #1C86EE;
/* 		display:inline-block; */
	}
	.header .logo{
		color: #fff;
		line-height: 72px;
		font-size: 30px;
		margin-left: 20PX;
		display:inline-block;
		font-weight:500;
		float: left;
	}
	.header ul li{
		list-style:none;
		float: left;
		color: #fff;
		display: inline-block;
		width: 112px;
		height: 72px; 
		text-align: center;
		line-height: 72px;
		cursor:pointer;
		
	}
	.header ul li.first{
		margin-left: 30px;
	}
	a{
		color: #fff;
		text-decoration: none;
	}
	.header ul li:hover{
		background: #74b0e2;
	}
	.header .login{
		float: right;


		color: #fff;
		display: inline-block;
		width: 112px;
/* 		height: 72px;  */
		line-height: 72px;
		margin-right: 20px;
	}
	
	.banner{
	    
		height: 380px;
		overflow: hidden;
		background: #ccc;
		
		
	}
</style>

</head>
<body>
	<div class="header">
		<div class='logo'>原创文字</div>
		<ul>
			<li class='first'><a href="javascript:void(0)">首页</li>
			<li><a href="javascript:void(0)">原创故事</li>
			<li><a href="javascript:void(0)">热门专题</li>
			<li><a href="javascript:void(0)">欣赏美文</li>
			<li><a href="javascript:void(0)">赞助</li>
			<li><a href="javascript:void(0)">精彩测试</li>
		</ul>
		
		<div class='login'>
			<span><a href="javascript:void(0)">登录</span>
			<span>|</span>
			<span><a href="javascript:void(0)">注册</span>
		</div>
	</div>
	
	<div class="banner">
	</div>
	
</body>
</html>